var app = new Vue({
    el: '#app',
    data: {
        selectAll: 0,
        list: [
            {
                classify: "电子产品",
                datas: [
                    {
                        id: 1,
                        name: 'iPhone 7',
                        price: 6188,
                        count: 1,
                        selected: 0
                    },
                    {
                        id: 2,
                        name: 'iPad Pro',
                        price: 5888,
                        count: 1,
                        selected: 0
                    },
                    {
                        id: 3,
                        name: 'MacBook Pro',
                        price: 21488,
                        count: 1,
                        selected: 0
                    }
                ]
            }
        ]
    },
    computed: {
        totalPrice: function () {
            var total = 0;
            this.list.forEach(function (valOut, indexOut) {
                valOut.datas.forEach(function(valIn,indexIn){
                    if (valIn.selected === 1)
                    total += valIn.price * valIn.count;
                })
            });
            return total.toString().replace(/\B(?=(\d{3})+$)/g, ',');
        }
    },
    methods: {
        handleReduce: function (indexOut,indexIn) {
            if (this.list[indexOut].datas[indexIn].count === 1) return;
            this.list[indexOut].datas[indexIn].count--;
        },
        handleAdd: function (indexOut,indexIn) {
            this.list[indexOut].datas[indexIn].count++;
        },
        handleRemove: function (indexOut,indexIn) {
            this.list[indexOut].datas.splice(indexIn, 1);
        },
        handleSelectAll: function () {
            this.selectAll = this.selectAll === 0 ? 1 : 0;
            var tmp = this.selectAll;

            this.list.forEach(function (valOut, indexOut) {
                valOut.datas.forEach(function(valIn,indexIn){
                    if (tmp === 0) {
                        valIn.selected = 0;
                    } else {
                        valIn.selected = 1;
                    }
                })
            });
        },
        handleSelect: function (indexOut,indexIn) {
            this.list[indexOut].datas[indexIn].selected = this.list[indexOut].datas[indexIn].selected === 0 ? 1 : 0;
        }
    }
})